<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>外部样式(external style)</title>

  <!-- link标签用于引入资源 -->
   <link rel="stylesheet" href="./css/index.css">
</head>
<body>
  <!-- 
  外部样式是指将样式信息存储在一个独立的CSS文件中，然后通过在HTML文档中链接这个CSS文件来应用样式。
  通过外部样式表，可以将样式代码与HTML内容分离，使得样式设置更具可维护性和可重用性。
  外部样式表可以同时应用于多个HTML文档，从而实现整个网站的统一风格。
  通过在HTML文档的 <link> 标签中引用外部样式表文件
  -->
  <div class="container">
    <h1>Hello, World!</h1>
    <p>This is a paragraph.</p>
    <p>This is another paragraph.</p>
    <h1>Hello, World!</h1>
  </div>
  
</body>
</html>